<template>

    <div class="bigbox">
        <van-pull-refresh v-model="loading" @refresh="onRefresh">
            <van-sticky>
                <van-dropdown-menu>
                    <van-dropdown-item v-model="value1" :options="option1" @change="changes" />
                </van-dropdown-menu>
            </van-sticky>

            <van-card v-for="item in list" :key="item" :title="item.number" v-show="item.equipmentName == showNAme">
                <template #tags>
                    <div>项目点：{{ item.entryName }}</div>
                    <!-- <div>进场时间：{{ item.applicationTime }}</div> -->
                    <div>责任人：{{ item.projectLeader }}</div>
                    <div v-show="item.belonging >= 1 && item.belonging <= 5">设备所属部门：数据{{ item.belonging }}部</div>
                    <div v-show="item.belonging == 6">设备所属部门：办公室</div>
                    <div v-show="item.belonging == 7">设备所属部门：其他</div>
                    <div v-show="item.realDepartment >= 1 && item.realDepartment <= 5">设备实在部门：数据{{ item.realDepartment
                        }}部</div>
                    <div v-show="item.realDepartment == 6">设备实在部门：办公室</div>
                    <div v-show="item.realDepartment == 7">设备实在部门：其他</div>
                    <div v-show="item.equipmentStatus == 0">状态：<van-tag type="danger">停用</van-tag></div>
                    <div>检查情况：
                        <van-tag type="danger" v-show="item.checkStatus == 1">未检查</van-tag>
                        <van-tag type="success" v-show="item.checkStatus == 2">已检查</van-tag>
                        <van-tag type="warning" v-show="item.checkStatus == 3">待处理</van-tag>
                    </div>
                </template>
                <template #footer>
                    <van-button size="mini" @click="showDetails(item)">详情</van-button>
                    <van-button size="mini" @click="showChange(item)">检查</van-button>
                    <van-button size="mini" @click="zhuis(item)">追溯</van-button>
                </template>
            </van-card>
            <van-empty description="暂无数据" v-show="list.length == 0" />
        </van-pull-refresh>
        <!-- 详情遮罩层 -->
        <van-overlay v-if="showDetailsValue" :show="showDetailsValue" @click="showDetailsValue = false"
            :lock-scroll="false">
            <div class="wrapper" @click.stop>
                <div class="block">
                    <div class="deitDiv">
                        <detailsVue v-bind="deitItems"></detailsVue>
                    </div>
                    <van-button @click="showDetailsValue = false" type="primary" block>关闭</van-button>
                </div>
            </div>
        </van-overlay>

        <!-- 检查遮罩层 -->
        <van-overlay v-if="showChangeValue" :show="showChangeValue" @click="showChangeValue = false">
            <div class="wrapper" @click.stop>
                <div class="block">
                    <changeVue v-bind="changeValue" @addEvent="closechange"></changeVue>
                </div>
            </div>
        </van-overlay>
        <!-- 追溯遮罩层 -->
        <van-overlay v-if="showZhuisValue" :show="showZhuisValue" @click="showZhuisValue = false">
            <div class="wrapper" @click.stop>
                <div class="block">
                    <div class="deitDiv">
                        <zhuisVue :zhuisId="zhuisId"></zhuisVue>
                    </div>
                    <van-button @click="showZhuisValue = false" type="primary" block>关闭</van-button>
                </div>
            </div>
        </van-overlay>
    </div>

</template>

<script setup>
import { showToast } from 'vant';
import axios from '../../sevce/index'
import { useRoute, useRouter } from "vue-router"
import { onMounted, ref, watch } from 'vue'
import DetailsVue from '../home/details.vue'
import changeVue from './updata.vue'
import zhuisVue from "../home/zhuisu.vue";
import {
    //获取数据列表
    gettables,
    //按部门查询
    gettablebm,
} from "../../sevce/user";
//登录用户信息
const name = ref()
const bm = ref('')
const qx = ref('')
const zw = ref('')

//读取本地存储 数据
function getuserinfo() {
    //读取本地存储的数据
    var data = JSON.parse(localStorage.getItem('userinfo'));
    if (data != null) {
        // console.log('本地存储数据', data.names)
        name.value = data.names
        bm.value = data.department
        qx.value = data.permissionId
        zw.value = data.position
    } else {
        router.push('/login')
    }
}
let list = ref([])
//获取表格数据
function gettable() {
    gettablebm(value1.value, 3).then((res) => {
        // console.log(res)
        list.value = res.data
    })
}
let route = useRoute()
let router = useRouter()
//修改
const changeValue = ref()

const showChangeValue = ref(false)

function showChange(item) {
    showChangeValue.value = true
    changeValue.value = item
}
//关闭修改窗
function closechange() {
    showChangeValue.value = false
    gettable()
}
//展示选项卡
let showNUM = ref(route.params.num)
let showNAme = ref('电脑')
//查看详情
const deitItems = ref()
const showDetailsValue = ref(false)
function showDetails(item) {
    showDetailsValue.value = true
    deitItems.value = item
}
//查看追朔 
const zhuisId = ref()
const showZhuisValue = ref(false)
function zhuis(item) {
    showZhuisValue.value = true
    zhuisId.value = item.id
}
//侦听器
watch(() => router.currentRoute.value.path, (ne, ol) => {
    if (ne === "/qt/qitaIndex/0") {
        showNUM.value = 0
        showNAme.value = '电脑'
    } else if (ne === "/qt/qitaIndex/1") {
        showNUM.value = 1
        showNAme.value = '高速扫描'
    } else if (ne === "/qt/qitaIndex/2") {
        showNUM.value = 2
        showNAme.value = '平板扫描'
    } else if (ne === "/qt/qitaIndex/3") {
        showNUM.value = 3
        showNAme.value = '打印机'
    } else if (ne === "/qt/qitaIndex/4") {
        showNUM.value = 4
        showNAme.value = 'A3扫描'
    } else if (ne === "/qt/qitaIndex/5") {
        showNUM.value = 5
        showNAme.value = '大图扫描'
    } else if (ne === "/qt/qitaIndex/6") {
        showNUM.value = 6
        showNAme.value = '交换机'
    } else if (ne === "/qt/qitaIndex/7") {
        showNUM.value = 7
        showNAme.value = '监控'
    } else if (ne === "/qt/qitaIndex/8") {
        showNUM.value = 8
        showNAme.value = '刻录机'
    } else if (ne === "/qt/qitaIndex/9") {
        showNUM.value = 9
        showNAme.value = '电钻'
    } else if (ne === "/qt/qitaIndex/10") {
        showNUM.value = 10
        showNAme.value = '加密狗'
    } else if (ne === "/qt/qitaIndex/11") {
        showNUM.value = 11
        showNAme.value = '录入笔'
    } else if (ne === "/qt/qitaIndex/12") {
        showNUM.value = 12
        showNAme.value = '插座'
    } else if (ne === "/qt/qitaIndex/13") {
        showNUM.value = 12
        showNAme.value = '裁纸刀'
    }
    else {
        // active.value = 0
    }

}, { immediate: true })

//下拉刷新
const count = ref(0);
const loading = ref(false);
const onRefresh = () => {
    gettable()
    setTimeout(() => {
        showToast('已刷新');
        loading.value = false;
        count.value++;
    }, 1000);
}



//部门选择
const value1 = ref(1);
const option1 = [
    { text: '数据一部', value: 1 },
    { text: '数据二部', value: 2 },
    { text: '数据三部', value: 3 },
    { text: '数据四部', value: 4 },
    { text: '数据五部', value: 5 },
    { text: '办公室', value: 6 },
];
function changes(ev) {
    gettablebm(value1.value, 3).then((res) => {
        list.value = res.data
    })
}
onMounted(() => {
    getuserinfo()
    gettable()

})
// gettableQT
</script>

<style lang="scss" scoped>
.bigbox {
    // height: 90vh;
    padding-bottom: 10vh;
}

.wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.block {
    width: 100vw;
    height: 80vh;
    background-color: #fff;
}

.deitDiv {
    width: 100vw;
    height: 75vh;
    overflow-y: scroll;
}
</style>